﻿<%@ Page Language="C#" Inherits="System.Web.Mvc.ViewPage" %>
<%@ Register src="Detail.ascx" tagname="WinDetail" tagprefix="uc1" %>
<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <link href="../../Resources/css/styles.css" rel="stylesheet" type="text/css" />
      <script type="text/javascript">
          var commandHandler = function (column, command, record, recordIndex, cellIndex) {
              alert(record.data.Id);
              switch (command) {
                  case "Edit":
                      App.ResourceDetailsWindow.show();
                      //var win = ResourceDetailsWindow;
                      //win.autoLoad.params.orderID = record.data.Id;
                      //win.setTitle('Recurso');
                      //win.show();
                      break;
                  case "Delete":
                      App.ResourceDetailsWindow.show();
                      //var win = ResourceDetailsWindow;
                      // win.autoLoad.params = record.data.Id;
                      // win.setTitle('Recurso');
                      //win.show();
                      break;
              }
          }
    </script>
</head>
<body>
    <ext:ResourceManager ID="ResourceManager1" runat="server" />
    <ext:Panel ID="Panel2" runat="server" Header="false" BodyCls="PanelContent" Border="false">
        <Items>
            <ext:Label Cls="HeaderLabel" ID="Label2" runat="server" Text="Recursos">
            </ext:Label>
        </Items>
    </ext:Panel>
    <br />
    <ext:Panel ID="Panel1" runat="server" Header="false" Border="false" BodyCls="PanelContent2"
        Layout="FitLayout">
        <Items>
            <ext:FormPanel ID="Panel3" Title="Filtros de Busqueda" BodyPadding="5" runat="server"
                Layout="FitLayout">
                <Items>
                    <ext:Container ID="Container1" runat="server" AnchorHorizontal="100%" Layout="Column"
                        Height="75" Padding="15">
                        <Items>
                            <ext:Container ID="Container2" runat="server" Layout="AutoLayout" ColumnWidth=".3">
                                <Items>
                                    <ext:TextField ID="txtName" runat="server" FieldLabel="Nombre" AnchorHorizontal="95%"
                                        LabelAlign="Left" />
                                    <ext:TextField ID="txtCosto" runat="server" FieldLabel="Costo" AnchorHorizontal="95%"
                                        LabelAlign="Left" />
                                </Items>
                            </ext:Container>
                            <ext:Container ID="Container3" runat="server" Layout="AutoLayout" ColumnWidth=".3">
                                <Items>
                                    <ext:TextField ID="txtLastName" runat="server" FieldLabel="Apellido Paterno" AnchorHorizontal="95%"
                                        LabelAlign="Left" />
                                    <ext:DateField ID="txtFechaNacimiento" runat="server" FieldLabel="Fecha Nacimiento"
                                        AnchorHorizontal="95%" LabelAlign="Left" />
                                </Items>
                            </ext:Container>
                            <ext:Container ID="Container4" runat="server" Layout="AutoLayout" ColumnWidth=".3">
                                <Items>
                                    <ext:TextField ID="txtSecondLastName" runat="server" FieldLabel="Apellido Materno"
                                        AnchorHorizontal="95%" LabelAlign="Left" />
                                    <ext:TextField ID="txtPhoneNumber" runat="server" FieldLabel="Telefono" AnchorHorizontal="95%"
                                        LabelAlign="Left" />
                                </Items>
                            </ext:Container>
                        </Items>
                    </ext:Container>
                </Items>
            </ext:FormPanel>
        </Items>
    </ext:Panel>
    <br />
    <br />
    <ext:Panel ID="Panel4" runat="server" Header="false" BodyCls="PanelContent" Border="false">
        <Items>
            <ext:GridPanel ID="gpResource" runat="server" Header="false" Border="false" TrackMouseOver="true"
                Title="Recurso" AutoExpandColumn="Name" CellId="Id">
                <ColumnModel ID="ColumnModel1" runat="server">
                    <Columns>
                        <ext:Column DataIndex="Id" Header="ID" runat="server" />
                        <ext:Column DataIndex="Name" Header="Nombre" runat="server" Sortable="true" />
                        <ext:Column DataIndex="LastName" Header="Apellido Paterno" runat="server" />
                        <ext:Column DataIndex="SecondLastName" Header="Apellido Materno" runat="server" />
                        <ext:DateColumn ID="DateColumn1" DataIndex="BirthDate" Header="Fecha Nacimiento"
                            Format="yyyy-MM-dd" runat="server" />
                        <ext:NumberColumn ID="Cost" DataIndex="Cost" Header="Costo" runat="server" />
                        <ext:Column DataIndex="PhoneNumber" Header="Telefono" runat="server" />
                        <ext:CommandColumn ID="clmDelete" Width="30px" DataIndex="ID" runat="server">
                            <Commands>
                                <ext:GridCommand Icon="Delete" CommandName="Delete"/>
                            </Commands>
                            <Listeners>
                                <Command Fn="commandHandler" />                                
                            </Listeners>
                        </ext:CommandColumn>
                        <ext:CommandColumn ID="clmEdit" Width="30px" DataIndex="Id" runat="server">
                            <Commands>
                                <ext:GridCommand Icon="ApplicationFormEdit" CommandName="Edit" />
                            </Commands>                            
                            <Listeners>
                                <Command Fn="commandHandler" />
                            </Listeners>
                        </ext:CommandColumn>
                    </Columns>
                </ColumnModel>
                <SelectionModel>
                    <ext:RowSelectionModel ID="RowSelectionModel1" runat="server" SingleSelect="true" />
                </SelectionModel>
                <BottomBar>
                     <ext:PagingToolbar ID="PagingToolbar1" 
                        runat="server"                      
                        DisplayInfo="true"
                        DisplayMsg="Mostrando Recursos {0} - {1} of {2}"
                        EmptyMsg="No Recursos para mostrar"                
                        />
                </BottomBar>
                <Store>
                    <ext:Store ID="dsResource" runat="server" PageSize="10" RemoteSort="true">
                        <Proxy>
                            <ext:AjaxProxy Url="/Resource/Resources/">
                                <ActionMethods Read="POST" />
                                <Reader>
                                    <ext:JsonReader Root="data" TotalProperty="total" />
                                </Reader>
                            </ext:AjaxProxy>
                        </Proxy>
                        <Model>
                            <ext:Model ID="mdlResource" runat="server">
                                <Fields>
                                    <ext:ModelField Name="Id" />
                                    <ext:ModelField Name="Name" />
                                    <ext:ModelField Name="LastName" />
                                    <ext:ModelField Name="SecondLastName" />
                                    <ext:ModelField Name="BirthDate" />
                                    <ext:ModelField Name="PhoneNumber" />
                                    <ext:ModelField Name="Cost" />
                                </Fields>
                            </ext:Model>
                        </Model>
                        <Sorters>
                            <ext:DataSorter Property="Name" Direction="ASC" />
                        </Sorters>
                        <AutoLoadParams>
                            <ext:StoreParameter Name="limit" Value="11" Mode="Raw" />
                            <ext:StoreParameter Name="start" Value="1" Mode="Raw" />
                        </AutoLoadParams>
                    </ext:Store>
                </Store>                
            </ext:GridPanel>
        </Items>
    </ext:Panel>
    <ext:Window 
        ID="ResourceDetailsWindow" 
        runat="server" 
        Icon="Group" 
        Title="Detalle de Recurso"
        Width="400" 
        Height="400" 
        AutoShow="false" 
        Modal="true" 
        Hidden="true"
        Layout="FitLayout">
        <Loader runat="server" Url="/Resource/Edit/" Mode="Frame" ReloadOnEvent="true"   >
            <LoadMask ShowMask="true" Msg="Cargando.." />
            <Params>
                 <ext:Parameter Name="id" Value="99" Mode="Raw" />            
            </Params>
        </Loader>    
    </ext:Window>
</body>
</html>
